<template>
    <div style="background-color: white;width: 100%;height: 80%;">
        <el-button link @click="StorageShow()" style="margin-left: 10px;">‹返回</el-button>
        &nbsp;
        <span>|</span>
        &nbsp;
        <span style="font-size: 17px;font-weight: 700;"> 入库单头信息(🛠️)</span>
        <hr style='background-color:#d3d3d3; height:1px; border:none;'>
        
        <el-form  class="demo-ruleForm" :model="form" ref="formRef" label-width="auto" style="max-width: 1100px;margin-left: 180px;margin-top: 30px;">
            <el-form-item label="入库单编码" style="margin: 40px;width: 500px;"  prop="storageNo" :rules="[ { required: true, message: '必填' },]">
                <el-input v-model="form.storageNo"  />
            </el-form-item>

            <el-form-item label="入库类型" style="width: 500px;float: right;margin-top: -72px;" prop="storageType" :rules="[ { required: true, message: '必填' },]">
                <el-select v-model="form.storageType" placeholder="请选择">
                    <el-option label="采购入库" value="采购入库" />
                    <el-option label="杂项入库" value="杂项入库" />
                    <el-option label="采购退货" value="采购退货" />
                    <el-option label="生产退货" value="生产退货" />
                    <el-option label="工厂入库" value="工厂入库" />
            </el-select>
            </el-form-item>

            <el-form-item label="仓库" style="margin: 40px;width: 500px;" prop="warehouseId" :rules="[ { required: true, message: '必填' },]" >
            <el-select v-model="GetIndustry.warehouseId" >
                <el-option label="请选择" :value="0" />
                <el-option v-for="item in options" :label="item.warehouseName" :value="item.warehouseId" @click="Warehouse()"/>
            </el-select>
            </el-form-item>

            <el-form-item label="仓库地址" style="width: 500px;float: right;margin-top: -72px;"  >
                <el-input  disabled  v-model="form.warehouseAddr"/>
            </el-form-item>

            <el-form-item label="入库日期" style="margin: 40px;width: 500px;" prop="storageDate" :rules="[ { required: true, message: '必填' },]">
                <el-col :span="11">
                    <el-date-picker
                    v-model="form.storageDate"
                    type="date"
                    placeholder="Pick a date"
                    style="width: 400px"
                    />
                </el-col>
            </el-form-item>

            <el-form-item label="备注" style="width: 500px;float: right;margin-top: -72px;" >
                <el-input v-model="form.storageRemark"  />
            </el-form-item>


            <el-form-item label="入库来源" style="margin: 40px;width: 500px;" prop="purchasingTypeId" :rules="[ { required: true, message: '必填' },]">
                <el-select v-model="form.purchasingTypeId" placeholder="请选择">
                    <el-option label="请选择" :value="0" />
                    <el-option v-for="item in options1" :label="item.purchasingTypeName" :value="item.purchasingTypeId" />
            </el-select>
            </el-form-item>

            <el-form-item label="来源头编码" style="width: 500px;float: right;margin-top: -72px;" >
                <el-input v-model="form1.purchasingNo"  :disabled="form.purchasingTypeId==0" @click="Purch"/>
            </el-form-item>

            <el-form-item label="来源头名称" style="margin: 40px;width: 500px;" >
                <el-input v-model="form1.purchasingName" disabled/>
            </el-form-item>

            <el-form-item label="供应商" style="width: 500px;float: right;margin-top: -72px;"  >
                <el-input v-model="form1.suppliersName" disabled/>
            </el-form-item>

            <el-form-item label="质检状态"  style="margin: 40px;width: 500px;" >
                <el-select v-model="form.qualityState"   >
                <el-option label="已质检" :value="true" />
                <el-option label="未质检" :value="false" />
            </el-select>
            </el-form-item>

            <el-form-item label="入库状态" style="width: 500px;float: right;margin-top: -72px;">
                <el-select v-model="form.storageState"   >
                <el-option label="已入库" :value="true" />
                <el-option label="未入库" :value="false" />
            </el-select>
            </el-form-item>

            <el-form-item label="制单人" style="margin: 40px;width: 500px;" prop="makeSingle" :rules="[ { required: true, message: '必填' },]">
                <el-input v-model="form.makeSingle" />
            </el-form-item>
            

            <el-form-item label="制单部门" style="width: 500px;float: right;margin-top: -72px;" prop="makeDepartment" :rules="[ { required: true, message: '必填' },]">
                <el-select v-model="form.makeDepartment" >
                <el-option label="销售部" value="销售部" />
                <el-option label="后勤部" value="后勤部" />
                <el-option label="技术部" value="技术部" />
            </el-select>
            </el-form-item>


            <el-button type="success" style="width: 83px;float: right" @click="submitForm(formRef)">修改</el-button>
            
        </el-form>
    </div>
    <div style="background-color: white;width: 100%;height: 30%;margin-top: 2px;">
        <span style="font-size: 17px;font-weight: 700;color: cornflowerblue;margin: 10px;"> 销售订单行信息</span>
        <hr style='background-color:#d3d3d3; height:1px; border:none;'>
        <el-button type="primary" style="margin: 10px;float: right;" @click="dialogTableVisible1=true">+新增订单行</el-button>
        <el-table :data="tableData" stripe style="width: 100%;margin-top: 20px;" border :header-cell-style="{background:'#f5f7fa'}">
            <el-table-column prop="orderTineId" label="序号"  />
           <el-table-column prop="itemName" label="物料编码"  />
           <el-table-column prop="prices" label="物料名称"   />
           <el-table-column prop="nums" label="数量" />
           <el-table-column prop="unit" label="单位" />
           <el-table-column prop="summary" label="摘要"  />
           <el-table-column prop="handleTime" label="创建时间"  >
            <template #default="scope">
                {{ scope.row.handleTime.substring(0,19) }}
            </template>
           </el-table-column>
           <el-table-column prop="handle" label="创建人" width="120px" />
           <el-table-column label="操作" width="200">
            <template #default="scope">
                <el-button size="small" @click="LineDel(scope.row.orderTineId)">删除</el-button>
                <el-button size="small" @click="GetLineMan(scope.row.orderTineId)">编辑</el-button>
            </template>
           </el-table-column>
        </el-table>
    </div>

    <el-dialog v-model="dialogFormVisible" title="采购订单选择" width="700" style="height: 570px;" >
        <el-table :data="tableData1" stripe style="width: 100%;margin-top: 20px;" border :header-cell-style="{background:'#f5f7fa'}" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" />
            <el-table-column prop="purchasingNo" label="订单编码"  />
           <el-table-column prop="purchasingName" label="订单名称"  />
           <el-table-column prop="purchasingTypeName" label="订单类型"   />
           <el-table-column prop="suppliersName" label="供应商" />
           <el-table-column prop="signUpTime" label="签到日期" />
           <el-table-column prop="billMaking" label="采购员"  />
           <el-table-column prop="purchasingStatus" label="状态" >
            <template #default="scope">
                <el-tag v-if="scope.row.purchasingStatus == 1" type="info">确认</el-tag>
                <el-tag v-if="scope.row.purchasingStatus == 2" type="info">未确认</el-tag>
            </template>
           </el-table-column>
        </el-table>
        <div >
         <el-pagination
                 v-model:current-page="pensce.pageIndex"
                 v-model:page-size="pensce.pageSize"
                 layout="prev, pager, next"
                 :total="pensce.totalcount"
                 class="mt-4"
                 @current-change="handleCurrentChange"
                 style="float: right;"
               />
               <span style="float: right;margin-top: 4px">共{{ pensce.totalcount }}条</span>
       </div>
       <br/><br/>
       <el-button type="success" style="float: right;" @click="dialogFormVisible=false">确认</el-button>
       <el-button style="float: right;margin-right: 20px;" @click="dialogFormVisible=false">返回</el-button>
    </el-dialog>

    <el-dialog v-model="dialogTableVisible1" title="销售订单行编辑" width="500" >
        <hr style='background-color:#d3d3d3; height:1px; border:none;'>
        <el-form :model="form" label-width="auto" style="max-width: 600px;margin-top: 10px;">
            <el-form-item label="物料">
            <el-select v-model="Line.inventoryInfoId" placeholder="">
                <el-option label="请选择" :value="0" />
                <el-option v-for="item in optionse" :label="item.itemName" :value="item.inventoryInfoId" />
            </el-select>
            </el-form-item>
            <el-form-item label="单价">
                <el-input v-model="Line.prices" />
            </el-form-item>
            <el-form-item label="数量">
                <el-input v-model="Line.nums" />
            </el-form-item>
            <el-form-item label="单位">
            <el-select v-model="Line.unit" placeholder="请选择">
                <el-option label="个/台" value="个/台" />
                <el-option label="次" value="次" />
                <el-option label="克" value="克" />
                <el-option label="小时" value="小时" />
                <el-option label="千克" value="千克" />
                <el-option label="毫升" value="毫升" />
                <el-option label="人" value="人" />
            </el-select>
            </el-form-item>
            <el-form-item label="行金额">
                <el-input v-model="Line.sum" disabled>
                    <template #append>
                        {{Line.sum=Line.prices*Line.nums}}
                    </template>
                </el-input>
            </el-form-item>
            <el-form-item label="行摘要">
                <el-input v-model="Line.summary" />
            </el-form-item>
            <el-button style="margin-left: 330px;" @click="dialogTableVisible1=false">返回</el-button>
            <el-button type="primary" style="margin-left: 400px;margin-top: -58px;" @click="OrderLineAdd()">确定</el-button>
        </el-form>
    </el-dialog>

    <el-dialog v-model="dialogTableVisible2" title="销售订单行编辑" width="500" >
        <hr style='background-color:#d3d3d3; height:1px; border:none;'>
        <el-form :model="form" label-width="auto" style="max-width: 600px;margin-top: 10px;">
            <el-form-item label="物料">
            <el-select v-model="Line.inventoryInfoId" placeholder="">
                <el-option label="请选择" :value="0" />
                <el-option v-for="item in optionse" :label="item.itemName" :value="item.inventoryInfoId" />
            </el-select>
            </el-form-item>
            <el-form-item label="单价">
                <el-input v-model="Line.prices" />
            </el-form-item>
            <el-form-item label="数量">
                <el-input v-model="Line.nums" />
            </el-form-item>
            <el-form-item label="单位">
            <el-select v-model="Line.unit" placeholder="请选择">
                <el-option label="个/台" value="个/台" />
                <el-option label="次" value="次" />
                <el-option label="克" value="克" />
                <el-option label="小时" value="小时" />
                <el-option label="千克" value="千克" />
                <el-option label="毫升" value="毫升" />
                <el-option label="人" value="人" />
            </el-select>
            </el-form-item>
            <el-form-item label="行金额">
                <el-input v-model="Line.sum" disabled>
                    <template #append>
                        {{Line.sum=Line.prices*Line.nums}}
                    </template>
                </el-input>
            </el-form-item>
            <el-form-item label="行摘要">
                <el-input v-model="Line.summary" />
            </el-form-item>
            <el-button style="margin-left: 330px;" @click="dialogTableVisible2=false">返回</el-button>
            <el-button type="primary" style="margin-left: 400px;margin-top: -58px;" @click="OrderLineUpdate()">确定</el-button>
        </el-form>
    </el-dialog>
</template>

<script lang="ts" setup>
import { ref,reactive,onMounted } from 'vue'
import  { ElMessage, ElMessageBox } from 'element-plus'
import type { FormInstance } from 'element-plus'
import {useRouter,useRoute} from 'vue-router'
import axios from 'axios';
const formRef = ref<FormInstance>()
const dialogFormVisible = ref(false);

const dialogTableVisible1 = ref(false);

const dialogTableVisible2 = ref(false);

const apiurls = import.meta.env.VITE_APP_API_URL_ProductionAdd;
const apiurl = import.meta.env.VITE_APP_API_URL_ProductionShow;

const router = useRouter()
const route = useRoute()

const form = reactive({
    storageId:0,
    storageNo:'',
    storageType:'',
    warehouseId:0,
    warehouseAddr:'',
    storageDate:'',
    storageRemark:'',
    purchasingTypeId:0,
    purchasingTypeName:'',
    purchasingId:0,
    qualityState:true,
    storageState:true,
    makeSingle:'',
    makeDepartment:'',
    isDelete:false,
    handle:'李四',
    handleContext:'添加',
    handleTime:'2024-12-18',
    pid:0,
})

const GetIndustry=reactive({
    warehouseId:0,
})

//仓库
const options=ref([])
const Warehouse=()=>{
    axios.post(apiurl+'/api/ShowProduction/GetWarehouseSrceten',GetIndustry).then((res)=>{
        options.value=res.data.data
        form.warehouseAddr=res.data.data[0].warehouseAddr
    })
}

const Purce=reactive({
})
//委外类型订单
const options1=ref([])
const PurchasingTypess=()=>{
    axios.post(apiurl+'/api/ShowProducManagement/PurchasingTypeShow',Purce).then((res)=>{
        options1.value=res.data.data
    })
}

const pensce=reactive({
    pageIndex:1,
   pageSize:4,
   totalcount:0,
   pagecount:0,
})
//委外订单
const tableData1=ref([])
const Purch=()=>{
    dialogFormVisible.value=true
    axios.post(apiurl+'/api/ShowProduction/GetPurchasings',pensce).then((res)=>{
        tableData1.value=res.data.data.list
        pensce.totalcount=res.data.data.totalcount
        pensce.pagecount=res.data.data.pagecount
    })
}

//分页
const handleCurrentChange = (val: number) => {
    pensce.pageIndex = val;
    Purch();
};

const form1=reactive({
    purchasinId:0,
    purchasingNo:'',
    purchasingName:'',
    suppliersName:'',
})

//多选
const multipleSelection = ref([])
const handleSelectionChange = (val: any) => {
  multipleSelection.value = val
  form1.purchasinId=val[0].purchasinId
  form1.purchasingNo=val[0].purchasingNo
  form1.purchasingName=val[0].purchasingName
  form1.suppliersName=val[0].suppliersName
  console.log(form1.purchasinId)
}



const submitForm=(formEl: FormInstance | undefined)=>{
    if (!formEl) return
    formEl.validate((valid) => {
      if (valid) {
        console.log('submit!')
        return;
      } else {
        console.log('error submit!')
        return;
      }
    })
    GetStorageUpdate()
}

//入库反填
const GEtMange=()=>{
    let storageId=route.query.storageId
    axios.post(apiurl+'/api/ShowProduction/GetStorageMan',{
        storageId:storageId
    }).then((res)=>{
        form.storageId=res.data.data.storageId
        form.storageNo=res.data.data.storageNo
        form.storageType=res.data.data.storageType
        GetIndustry.warehouseId=res.data.data.warehouseId
        form.storageDate=res.data.data.storageDate
        form.storageRemark=res.data.data.storageRemark
        form.purchasingTypeId=res.data.data.purchasingTypeId
        form.qualityState=res.data.data.qualityState
        form.storageState=res.data.data.storageState
        form.makeSingle=res.data.data.makeSingle
        form.makeDepartment=res.data.data.makeDepartment
    })
}

//入库反填
const PurchMange=()=>{
    let purchasinId=route.query.purchasinId
    axios.post(apiurl+'/api/ShowProduction/GetPurchasingsMan',{
        purchasinId:purchasinId
    }).then((res)=>{
        form1.purchasinId=res.data.data.purchasinId
        form1.purchasingNo=res.data.data.purchasingNo
        form1.purchasingName=res.data.data.purchasingName
        form1.suppliersName=res.data.data.suppliersName
        console.log(res.data.data.purchasinId)
    })
}


//添加
const GetStorageUpdate=()=>{
    if(form.storageNo==''){
        return;
    }
    if(form.storageType==''){
        return;
    }

    if(form.storageDate==''){
        return;
    }
    if(form.purchasingTypeId==0){
        return;
    }
    if(form.makeSingle==''){
        return;
    }
    if(form.makeDepartment==''){
        return;
    }

    axios.post(apiurls+'/api/ProductionLeo/GetStorageUpdate',{
        storageId:form.storageId,
        storageNo:form.storageNo,
        storageType:form.storageType,
        warehouseId:GetIndustry.warehouseId,
        storageDate:form.storageDate,
        storageRemark:form.storageRemark,
        purchasingTypeId:form.purchasingTypeId,
        purchasinId:form1.purchasinId,
        qualityState:form.qualityState,
        storageState:form.storageState,
        makeSingle:form.makeSingle,
        makeDepartment:form.makeDepartment,
        isDelete:form.isDelete,
        
    }).then((res)=>{
        if(res.data.code==1){
            ElMessage({
                message: '修改成功',
                type: 'success',
            })
            StorageShow()
        }else{
            ElMessage.error(res.data.msg)
        }
    })
}

//订单行
const tableData=ref([])
const OrdesTine=()=>{
    let storageId=route.query.storageId
    axios.post(apiurl+'/api/ShowProduction/GetOrderTineShow',{
        storageId:storageId
    }).then((res)=>{
        tableData.value=res.data.data
    })
}

//订单行添加
const Line=reactive({
    orderTineId:0,
    inventoryInfoId:0,
    prices:0,
    nums:0,
    sum:0,
    unit:'',
    summary:'',
    storageId:0,
    isDelete:false,
    handle:'张三',
    handleContext:'添加',
    handleTime:'2024-12-14',
    pid:0,
})

const fend=reactive({
   
})
//物料
const optionse=ref([])
const Imans=()=>{
    axios.post(apiurl+'/api/ShowProduction/GetItemInfosSrceten',fend).then((res)=>{
        optionse.value=res.data.data
    })
}

const OrderLineAdd=()=>{
    let storageId=route.query.storageId
    axios.post(apiurls+'/api/ProductionLeo/GetOrderTineAdd',{
        inventoryInfoId:Line.inventoryInfoId,
        prices:Line.prices,
        nums:Line.nums,
        unit:Line.unit,
        summary:Line.summary,
        storageId:storageId,
        isDelete:Line.isDelete,
        handle:Line.handle,
        handleContext:Line.handleContext,
        handleTime:Line.handleTime,
        pid:Line.pid,
    }).then((res)=>{
        if(res.data.code==1){
            ElMessage({
                message:"添加成功",
                type:'success'
            })
            dialogTableVisible1.value=false
        }else{
            ElMessage({
                message:"添加失败",
                type:'error'
            })
        }
    })
}

//订单行删除
const LineDel=(orderTineId:any)=>{
    ElMessageBox.confirm(
        '此操作将永久删除该文件, 是否继续?',
        '提示',
        {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
        }
    )
    .then(() => {
        axios.post(apiurls+'/api/ProductionLeo/GetOrderTineDel',{
            orderTineId:orderTineId
        }).then((res)=>{
            if(res.data.code==1){
                ElMessage({
                    type: 'success',
                    message: '删除成功!',
                })
            }
        })
    })
    .catch(() => {
        ElMessage({
            type: 'info',
            message: '已取消删除',
        })
    })
}


//订单行反填
const GetLineMan=(orderTineId:any)=>{
    dialogTableVisible2.value=true
    axios.post(apiurl+'/api/ShowProduction/GetOrderTineMan',{
        orderTineId:orderTineId
    }).then((res)=>{
        Line.orderTineId=res.data.data.orderTineId
        Line.inventoryInfoId=res.data.data.inventoryInfoId
        Line.prices=res.data.data.prices
        Line.nums=res.data.data.nums
        Line.unit=res.data.data.unit
        Line.summary=res.data.data.summary
    })
}

//订单行修改
const OrderLineUpdate=()=>{
    axios.post(apiurls+'/api/ProductionLeo/GetOrderTineUpdate',Line).then((res)=>{
        if(res.data.code==1){
            ElMessage({
                message: '保存成功',
                type: 'success',
            })
            dialogTableVisible2.value=false
        }else{
            ElMessage.error(res.data.msg)
        }
    })
}


const StorageShow=()=>{
    router.push('/StorageShow')
}


onMounted(()=>{
    Warehouse();
    PurchasingTypess()
    GEtMange()
    PurchMange()
    Imans()
    OrdesTine()
})
</script>